<template>
  <el-row id="cpts-operate-log">
    <el-row v-if="!isViewShow" class="permission">
      没有权限!
    </el-row>

    <el-card v-else class="box-card">
      <div slot="header" class="clearfix">
        <span>操作日志</span>
      </div>

      <!--条件栏-->
     <!-- <el-row class="condition-layout">
        <span>角色:</span>
        <el-select v-model="roleValue" placeholder="请选择">
          <el-option
            v-for="item in roleOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
        <span class="select-style">日期:</span>
        <el-date-picker
          :type="pickerType"
          :value-format="dateFormat"
          @change="onPickerChange"
          v-model="selectDate"
          placeholder="选择日期时间">
        </el-date-picker>
        <span class="select-style">操作:</span>
        <el-select v-model="operateValue" placeholder="请选择">
          <el-option
            v-for="item in operateOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
        <span class="select-style">结果:</span>
        <el-select v-model="operateValue" placeholder="请选择">
          <el-option
            v-for="item in operateOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
        <el-button class="select-style" type="primary">确定</el-button>
      </el-row>-->

      <!--表格栏-->
      <el-row class="table-layout">
        <el-table
          :data="tableDatas"
          max-height="640"
          header-align="center"
          style="width: 100%">
          <el-table-column
            prop="createTime"
            align="center"
            label="下发时间">
          </el-table-column>
          <el-table-column
            prop="content"
            align="center"
            label="下发内容">
          </el-table-column>
          <el-table-column
            prop="result"
            align="center"
            :formatter="statusFormatter"
            label="下发结果">
          </el-table-column>
         <!-- <el-table-column
            prop="warnTime"
            label="操作方"
            align="center">
          </el-table-column>
          <el-table-column
            prop="eventName"
            align="center"
            label="所属角色">
          </el-table-column>
          <el-table-column
            prop="tagName"
            align="center"
            label="操作">
          </el-table-column>
          <el-table-column
            prop="markValue"
            align="center"
            label="操作对象">
          </el-table-column>
          <el-table-column
            prop="warnType"
            align="center"
            label="操作结果">
          </el-table-column>
          <el-table-column
            prop="warnLevel"
            label="操作时间"
            align="center">
          </el-table-column>-->
        </el-table>
      </el-row>

      <!--分页栏-->
     <!-- <el-row class="pagination-layout">
        <el-pagination
          layout="prev, pager, next"
          :total="paginationCount"
          :current-page="currentPage"
          :page-size="pageSize"
          @current-change="onPageChange">
        </el-pagination>
      </el-row>-->

    </el-card>

  </el-row>
</template>

<script>
  export default {
    name: "operateLog",
    data(){
      return {
        isViewShow: false,
        isViewEdit: false,
        activeName:'1',
        roleOptions:[{label:'全部',value:"1"},{label:'管理员',value:"2"},{label:'部门经理',value:"3"},{label:'技术员',value:"4"}],
        roleValue: "1",
        operateValue: "1",
        operateOptions:[{label:'全部',value:"1"},{label:'增加',value:"2"},{label:'修改',value:"3"},{label:'删除',value:"4"}],
        pickerType:'date',
        dateFormat: 'yyyy-MM-dd',
        selectDate: new Date(),
        tableDatas:[],
        paginationCount: 0,
        currentPage:1,
        pageSize:10,
      }
    },
    mounted(){
      let obj = this.validateGlobal.getPermission(19)
      this.isViewShow = obj.isViewShow
      this.isViewEdit = obj.isViewEdit
      this.askLists()
    },
    methods:{
      onPickerChange: function(date){
        this.selectDate = date
        // TODO

      },
      onPageChange: function(currentPage){
        this.currentPage = currentPage;
        // TODO

      },
      statusFormatter: function(value){
        if (value) {
          return "成功"
        }else{
          return "失败"
        }
      },
      askLists: function () {
        let _that = this
        let userId = sessionStorage.getItem("userId")
        let url = _that.ports.roleManage.operateLog
        let gateway = sessionStorage.getItem("gateway")
        let askData = {
          userId: userId,
          sn: gateway
        }
        this.http.get(url,askData, res => {
          if(!_that.validateGlobal.isEmpty(res) && res.code == 200){
             if (res.data) {
               _that.tableDatas = res.data
             }
          }else{
            _that.$message('列表获取失败!');
          }
        })
      },
    }
  }
</script>

<style lang="scss">
  #cpts-operate-log{

    .select-style{
      margin-left: 10px;
    }

    .el-card{
      margin: 20px 20px 0 20px;
      height: 770px;

      .condition-layout{

      }

      .table-layout{
         margin-top: 20px;
      }

      .pagination-layout{
        text-align: center;
        margin-top: 10px;
      }


    }

    .evc-dialog-itemize{
      > :first-child.el-row{
        margin-top: 10px;
        margin-bottom: 20px;
      }
    }

    .evc-submit-layout{
      display: flex;
      justify-content: center;
      margin-top: 20px;
    }
  }
</style>
